<template>
  <div>
    <Nav :title="title"></Nav>

    <!-- 商品展示 -->
    <div class="footer-goods" v-if="list">
      <ul class="newGoodList">
          <li
            class="newGoodList-item"
            v-for="el in list"
            :key="el.id"
            @click="toGoodsDetail(el.id)"
          >
            <img class="img" :src="el.list_pic_url" alt="" />
            <div class="goods-txt">
              <span class="txt-t">{{el.goods_brief }}</span>
              <span class="txt-b">{{el.retail_price }}</span>
            </div>
          </li>
         <li></li>
        </ul>
    </div>

  </div>
</template>

<script>
import { listAction } from '@/api/user/user'
import { ref } from 'vue'
import { useRouter } from 'vue-router'
export default {
  name: 'collectApi',
  setup () {
    const router = useRouter()
    const title = ref('收藏')
    const list = ref([])
    const data = ref([])
    listAction({
      openId: localStorage.getItem('openId')
    }).then(res => {
      data.value = res.collectGoodsList
      console.log(res, '1', data.value)
    })
    const toGoodsDetail = (id) => {
      router.push({ path: '/home/goodsDetail', query: { id: id } })
    }
    const backTo = () => {
      router.back()
    }

    return { list, toGoodsDetail, backTo, title, data }
  }

}
</script>

<style lang="scss" scoped>
@import './scss/index.scss'
</style>>
